<%@ page import="jspSamples.unit7.websiteSample.News" %><%--
  Created by IntelliJ IDEA.
  User: dell
  Date: 2024/11/5
  Time: 19:48
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
    <link rel="stylesheet" href="css/bootstrap.css">
    <link rel="stylesheet" href="css/bootstrap-theme.css">
</head>
<body>
<!-- 头部栏，包含网站logo和后台管理文字 -->
<div class="row wrap" >
    <div class="col-md-3 " >
        <img width="50" height="50" src="./img/log.jpg" alt="">
        <span style="color:white"><b >天码行空学习建站</b> <small>后台管理</small></span>
    </div>
    <div class="col-md-7 "></div>
    <!-- 退出按钮 -->
    <div class="col-md-2 ">
        <button style="margin-top: 20px" class="btn btn-primary btn-sm ">退出</button>
    </div>
</div>
<!-- 侧边栏和主要内容区域 -->
<div class="row">
    <!-- 侧边栏，包含导航链接 -->
    <div style="height:100%;background: #1b6d85" class="col-md-2">
        <ul style="background: white" class="nav nav-tabs nav-stacked">
            <li class="active"><a href="#">新闻管理</a></li>
            <li ><a href="#">公告管理</a></li>
            <li ><a href="#">管理员管理</a></li>
        </ul>
    </div>
    <!-- 主要内容区域 -->
    <div class="col-md-10">
        <ul class="breadcrumb">
            <li><a href="#">后台管理</a></li>
            <li><a href="#">新闻管理</a></li>
        </ul>
        <!-- 新闻管理表格 -->
        <table class="table table-striped table-hover">
            <caption>
                <button style="color: white" class="btn btn-primary btn-sm">+添加新闻</button>
            </caption>
            <thead>
            <tr>
                <th>序号</th>
                <th>新闻标题</th>
                <th>创建人</th>
                <th>创建时间</th>
                <th>操作</th>
            </tr>
            </thead>
            <tbody>
            <tr>
                <td>001</td>
                <td>Tanmay</td>
                <td>Bangalore</td>
                <td>560001</td>
                <td>
                    <span class="btn-sm btn-primary">修改</span>
                    <span class="btn-sm btn-danger">删除</span>
                </td>
            </tr>
            <tr>
                <td>002</td>
                <td>Tanmay</td>
                <td>Bangalore</td>
                <td>560001</td>
                <td>
                    <span class="btn-sm btn-primary">修改</span>
                    <span class="btn-sm btn-danger">删除</span>
                </td>
            </tr>
            <tr>
                <td>003</td>
                <td>Tanmay</td>
                <td>Bangalore</td>
                <td>560001</td>
                <td>
                    <span class="btn-sm btn-primary">修改</span>
                    <span class="btn-sm btn-danger">删除</span>
                </td>
            </tr>
            </tbody>
        </table>
        <!-- 分页栏 -->
        <div class="row">
            <div style="line-height:75px" class="col-md-5">当前第1页/共2页,共8条记录 5条/页</div>
            <div class="col-md-5 col-md-offset-2">
                <ul class="pagination pagination-sm">
                    <li><a href="#">&laquo;</a></li>
                    <li class="active"><a href="#">1</a></li>
                    <li class="disabled"><a href="#">2</a></li>
                    <li><a href="#">3</a></li>
                    <li><a href="#">4</a></li>
                    <li><a href="#">5</a></li>
                    <li><a href="#">&raquo;</a></li>
                </ul>
            </div>
        </div>
    </div>
</div>
</body>
</html>

<!-- 自定义样式 -->
<style>
    .wrap{
        height: 50px;
        width: 100%;
        background: #1b6d85;
    }
    .wrap div{
        height:50px ;
    }

</style>


